<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--[if lt IE 9]>
<script type="text/javascript" src="static/html5shiv.js"></script>
<script type="text/javascript" src="static/respond.min.js"></script>
<![endif]-->

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/friends/all_7ea23d2.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/friends/global.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/friends/mbox-theme.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/friends/reset.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/friends/widget_ccf50cd.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/Hui-iconfont/1.0.8/iconfont.css" />
<!--[if IE 6]>
<script type="text/javascript" src="static/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<title>设置备注</title>

<style type="text/css">
a:HOVER{
	text-decoration: none;
}
a:link{
	text-decoration: none;
}
.sbtn {
    font-size: 14px;
    padding-left: 30px;
    height: 32px;
    line-height: 32px;
    position: relative;
    background-color: #3b8cff;
    border: 1px solid #3b8cff;
}
.dbtn {
    font-size: 14px;
    padding-left: 30px;
    height: 32px;
    line-height: 32px;
    margin: 0 4px;
}
.sbtn,.dbtn{
	color: #4d90eb;
    display: inline-block;
    _width: 35px;
    white-space: nowrap;
    outline: 0;
    text-decoration: none;
    border: 1px solid #c0d9fe;
    border-radius: 4px;
}
.sbtn b ,.dbtn b{
    font-weight: 100;
    display: block;
    height: 32px;
    line-height: 32px;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
}
.sbtn b{
	background-position: right -440px;
    color: #fff;
    padding-right: 30px;
}
.dbtn b {
    padding-right: 30px;
}
.clearfix {
    zoom: 1;
}
.sbtn:hover{
	background: #4d90eb;
}
</style>
</head>

<body>
<div class="dialog-panel module-remark-dialog" style="display: block; left: 410px; top: 383.5px;">
	<div class="content">
		<div class="text">给好友设置备注</div>
		<div class="input-box">
			<input id="_disk_id_18" type="text" value="" placeholder="">
			<label>
				<span id="_disk_id_20" class="use">0</span>/<span class="all">15</span>
			</label>
		</div>
		<div id="_disk_id_21" class="error" style="display: none;"></div>
	</div>
	<div class="footer">
		<div class="dialog-commands clearfix center">
			<a href="javascript:;" class="sbtn okay"><b>保存</b></a>
			<a href="javascript:;" class="dbtn cancel"><b>取消</b></a>
		</div>
	</div>
</div>

<script type="text/javascript" src="${pageContext.request.contextPath}/static/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="${pageContext.request.contextPath}/static/layer/2.4/layer.js"></script>

<script type="text/javascript" src="${pageContext.request.contextPath}/static/laypage/1.2/laypage.js"></script>
<script type="text/javascript">
$(function(){
	var set_remark = '<%=request.getParameter("set_remark")%>';
	var remark = '<%=request.getParameter("remark")%>';
	var count = '<%=request.getParameter("count")%>';
	var index = parent.layer.getFrameIndex(window.name);
	$("#_disk_id_18").val(remark);
	$(".use").html($("#_disk_id_18").val().trim().length);

	$("#_disk_id_18").on("keyup paste",function(){
		$(".use").html($(this).val().trim().length);
		if($("#_disk_id_18").val().trim() == ""){
			$(".use").html(0);
		}else if($(this).val().trim().length > 15){
			$(".use").css("color","red");
			if($(".error").css("display") == "block"){
				$(".error").html("超出15个字的限制啦");
			}
		}else{
			$(".use").css("color","");
		}
		
		if($(this).val().trim() == ""){
			if($(".error").css("display") != "none"){
				$(".error").html("请输入备注");
				$(".use").css("color","red");
			}
		}
	});
	
	$(".sbtn").click(function(){
		if($("#_disk_id_18").val().trim() == ""){
			$(".error").show();
			$(".error").html("请输入备注");
		}else if($("#_disk_id_18").val().trim().length > 15){
			$(".error").show();
			$(".error").html("超出15个字的限制啦");
		}else{
			$.ajax({
				url: "/nebula/friends/set-remark.action",
				dataType: "json",
				data: {
					friendname : function(){return set_remark.trim();},
					remark : $("#_disk_id_18").val().trim(),
				},
				success: function(data){
					parent.layer.msg(data.msg,{icon:1,time:2000,offset:"t"});
					parent.$(".header-tabs a").eq(1).click();
					parent.$(".friend-content-wrap .friend-list-item").eq(count).click();
					parent.layer.close(index);
				}
			});
		}
	});

	$(".dbtn").click(function(){
		parent.layer.closeAll();
	});
});
</script>
</body>
</html>
